<template>
    <div>
<h1>首页--门店网页</h1>
<input type="text" v-model="dataps.names" placeholder="请输入门店名称模糊查">
<select v-model="dataps.state">
    <option value="">请输入</option>
    <option value="true">开启</option>
    <option value="false">关闭</option>
</select>

<input type="button" value="查询" @click="GetShow()">
<a href="/log">去登陆</a>
        <table class="table">
            <thead>
                
                <tr>
                    <td>编号</td>
                    <td>店名</td>
                    <td>开店日期</td>
                    <td>店长名称</td>
                    <td>店长头像</td>
                    <td>店长电话</td>
                    <td>门店特点</td>
                    <td>状态</td>
                </tr>
            </thead>
            <tbody>
                <tr v-for="d in data">
                    <td>{{d.cordId}}</td>
                    <td>{{d.storeName}}</td>
                    <td>{{moment(d.createTime).format("YYYY年MM月DD日")}}</td>
                    <td>{{d.boassName}}</td>
                    <td><img :src="'https://localhost:7114/'+d.bossImg" style="width: 60px;height: 60px;"></td>
                    <td>{{d.bossPhone}}</td>
                    <td>{{d.storefeatures}}</td>
                    <td>{{d.storeState?"开启":"关闭"}}</td>
                </tr>
            </tbody>
        </table>
        总页<span>{{datada.listc}}</span>数 总条 <span>{{datada.listcount}}</span>数 当前 <span>{{dataps.pageindex}}</span>页
        <br>
        <input type="button" value="首页" @click="Tz(1)">
        <input type="button" value="上一页" @click="Tz(dataps.pageindex-1)">
        <input type="button" v-for="d in datada.listc" :value="d" @click="stan(d)">
        <input type="button" value="下一页" @click="Tz(dataps.pageindex+1)">
        <input type="button" value="尾页"@click="Tz(datada.listc)">
        <select v-model="dataps.pagesize" @change="xsyrl">
            <option value="2">2</option>
            <option value="4">4</option>
            <option value="6">6</option>
            <option value="8">8</option>
            <option value="10">10</option>
        </select>
        <input type="number" v-model="dataps.pageindex"> <input type="button" value="跳转到" @click="tzd">
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { ref,onMounted } from 'vue';
import moment from 'moment'
onMounted(()=>{
    GetShow();
})

const Tz=(i:any)=>{
if(i>=1&&i<=datada.value.listc)
{
    dataps.value.pageindex=i;
    GetShow();
}


}

const xsyrl=()=>{
    dataps.value.pageindex=1; 
    GetShow();

    
}
const tzd=()=>{
    
    GetShow();
}
const stan=(i:any)=>{
    dataps.value.pageindex=i;
    GetShow();
}

const dataps=ref({
    pageindex:1,
    pagesize:2,
    names:"",
    state:""
})

const data=ref([{

    "cordId": "",
      "storeName": "",
      "createTime": "2025-05-01T12:11:01.3466667",
      "boassName": "",
      "bossImg": "",
      "bossPhone": "",
      "storefeatures": "",
      "isDel": false,
      "storeState": true
}])

const datada=ref({
    listcount:6,
    listc:0,
})

const GetShow=()=>{
axios.get("/api/Store/GetShows",{params:dataps.value}).then(res=>{
    data.value=res.data.list;
    datada.value.listcount=res.data.listcount;
    datada.value.listc=Math.ceil(datada.value.listcount/dataps.value.pagesize)
})
}


</script>

<style scoped>

</style>